<template>
  <div class="main">
      <navi>

      </navi>
    <scrolls class="scrolls">

    </scrolls>
    <news>

    </news>

    <chef>

    </chef>
    <restaurant>

    </restaurant>
    <supplier>

    </supplier>
    <myfooter>
    </myfooter>

  </div>
</template>

<script>
  import navi from "@/components/public/navi.vue"
  import scrolls from "@/components/public/scrolls.vue"
  import chef from "./public/chef";
  import restaurant from "@/components/public/restaurant.vue"
  import news from "@/components/public/news.vue"
  import supplier from "@/components/public/supplier.vue"
  import myfooter from "@/components/public/footer.vue"




  export default {
    name: "index",
    components: { navi, scrolls,chef,restaurant,news,supplier,myfooter}//和上面import 进来的自定义名字关联
  }
</script>

<style scoped>
  .main {
    position: relative;
    margin: 0 auto;
    width: 1000px;


  }
  .navi {
    after:content;
    display:block;
    clear:both;
    position: absolute;
    z-index: 3;
  }


  .scrolls {
    margin-top: 10px;
    float: left;
    overflow: hidden;
  }

</style>
